<template>
	<view class="p-2 bg-light" style="height: 100vh;">
		<!-- 可用余额 -->
		<view class="bg-white flex flex-column align-center" style="justify-content: space-around;height: 300rpx;border-radius: 20rpx;">
			<view>我的余额(￥元)</view>
			<view class="font-lg">
				{{Price(balance)}}
			</view>
			<view class="flex justify-between" style="width: 60%;">
				<view class="bg-success px-3 text-white" style="height: 60rpx;line-height: 60rpx;border-radius: 50rpx;" @click="pay()">充值</view>
				<view class="bg-danger px-3 text-white" style="height: 60rpx;line-height: 60rpx;border-radius: 50rpx;">提现</view>
			</view>
		</view>
		<!-- 余额明细 -->
		<view class="p-2 bg-white mt-2" style="border-radius: 20rpx;height: 150rpx;">
			<!-- 1 -->
			<view class="flex justify-between">
				<text class="font-weight-bold font-sm">余额明细</text>
				<view class="flex align-center" @click="godetail()">
					<text class="font-small" style="color: #aaa;">查看全部</text>
					<uni-icons size="15" type="right"></uni-icons>
				</view>
			</view>
			<!-- 2 -->
			<view class="flex align-center justify-between mt-4 px-2">
				<view class="flex flex-column text-center">
					<text class="font-small mb-2">{{BlanceData.Order_Type=='1'?'余额支付':BlanceData.Order_Type=='0'?'余额充值':BlanceData.Order_Type=='2'?'退款':''}}</text>
					<text class="font-small" style="color: #bbb;">{{BlanceData.Collection_Date}}</text>
				</view>
				<view class=" font-sm flex align-center flex-column" @click="goincome(BlanceData)">
					<view class="flex align-center font-weight-bold">
						<text>{{BlanceData.Order_Type=='1'?'-':''}}￥{{money}}<text class="font-small">{{BlanceData.Order_Type=='0'?`(含赠送金额￥${BlanceData.Gift_Sales})`:''}}</text></text>
						<uni-icons size="15" style="color: #eeeeee;" class="ml-2" type="right"></uni-icons>
					</view>
				</view>
			</view>
		</view>
		<!-- 优惠券 -->
		<view class="p-2 bg-white mt-2" style="border-radius: 20rpx;">
			<!-- 1 -->
			<view class="flex justify-between">
				<text class="font-weight-bold font-sm">我的优惠券</text>
				<view class="flex align-center">
					<text class="font-small" style="color: #aaa;">查看全部</text>
					<uni-icons size="15" type="right"></uni-icons>
				</view>
			</view>
			<!-- 2 -->
			<view class="flex align-center flex-wrap justify-between mt-2 text-white">
				<view v-for="(item,i) in 4" :key="i" class="bg-blue mb-2 flex flex-column p-2 text-center" style="border-radius: 10rpx;margin-right: auto;">
					<text class="font-lg font-weight-bold">￥5</text>
					<text class="mb-2">满5.1元可用</text>
					<view class="text-blue bg-white px-2 py-1 font-sm text-center" style="border-radius: 20rpx;">
						立即使用
					</view>
				</view>
			</view>
		</view>
		<showRecharge :show="isShow" @Close="handleClose()"></showRecharge>
	</view>
</template>

<script>
	const app = getApp();
	import showRecharge from '@/components/payment/recharge.vue'
	export default {
		components: {
			showRecharge
		},
		data() {
			return {
				balance:0,//余额
				member_account_info:{},//账户信息
				isShow: false,//调起支付
				form:{
					Recharge_Amount:0,
					Collection_Type: "微信支付",
					App_ID: app.globalData.appid,
					Open_ID: app.globalData.openid,
					Enterprise_Info_SerialNumber: app.globalData.enterprise,
				},
				formData:{
					Member_SerialNumber:app.globalData.memberInfo.Member_SerialNumber,
				    page:1,
					limit:1,
					Order_Type:''
				},
				BlanceData:{},
				money:''
			}
		},
		computed:{
			Price() { //补零
				return function(price) {
					if (RegExp(/\./).exec(price)) {
						return price
					} else {
						return price + '.00'
					}
				}
			}
		},
		onLoad() {
			this.getData()
			this.getBlanceData(this.formData)
		},
		methods: {
			pay(){
				this.isShow = true;
			},
			goincome(data){
				uni.navigateTo({
					url:`/pages/my/Incomedetails?BalanceData=${encodeURIComponent(JSON.stringify(data))}`
				})
			},
			getBlanceData(data){
				uni.request({
					url:app.globalData.Domain_Name+"/WXBalanceDetailAction",
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data,
					success: (res) => {
						console.log(res);
						this.BlanceData = res.data.tableData[0]
						this.money = this.accAdd(this.BlanceData.Gift_Sales, this.BlanceData.Prepayment_Sales)
					}
				})
			},
			godetail(){
				uni.navigateTo({
					url:'/pages/my/Balancedetails'
				})
			},
			handleClose() { //关闭支付关闭
				this.isShow = false
			},
			balance_calculation(){	//计算余额,剩余充值余额+剩余赠送余额
				this.balance = this.accAdd(this.member_account_info.Prepayment_Balance,this.member_account_info.Gift_Balance);
			},
			accMul(arg1, arg2) { //浮点型相乘
				let m = 0,s1 = arg1.toString(),s2 = arg2.toString();
				try {m += s1.split(".")[1].length} catch (e) {}
				try {m += s2.split(".")[1].length} catch (e) {}
				return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m)
			},
			accAdd(arg1, arg2) {	//浮点型相加
				var r1, r2, m;
				try {r1 = arg1.toString().split(".")[1].length} catch (e) {r1 = 0}
				try {r2 = arg2.toString().split(".")[1].length} catch (e) {r2 = 0}
				m = Math.pow(10, Math.max(r1, r2))
				return (arg1 * m + arg2 * m) / m
			},
			getData(){ //查询余额
				uni.request({
					url:app.globalData.Domain_Name+" /WXMemberAccountInfoIDAction",
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data: {
						Member_SerialNumber: app.globalData.memberInfo.Member_SerialNumber,
					},
					success: (res) => {
						this.member_account_info = res.data[0];
						console.log(this.member_account_info);
						this.balance_calculation()
					}
				})
			}
		}
	}
</script>

<style>

</style>
